<script setup>
import {ref,defineProps} from 'vue'
const NoSupported = ref("不支持")
const Notentered = ref("未录入")
const value1 = ref(true)
//子父组件传输数据Props
const props = defineProps({
    type:String
})

</script>
<template>
    <div class="go">
        <p>
            <i class="iconfont icon-zhiwen right-1" style="font-size: 30px; color: rgb(85, 156, 232);" v-if="props.type=='当前设备是否支持指纹识别'"></i>
            <i class="iconfont icon-xiugai right-1" style="font-size: 30px; color: rgb(46, 217, 63);" v-if="props.type=='当前设备是否已经录入指纹信息'"></i>
            <i class="iconfont icon-unlock-fill right-1" style="font-size: 30px; color: rgb(231, 191, 73);" v-if="props.type=='开启/关闭指纹识别认证'"></i>
            <span style="font-weight: 700; font-size: 12px;margin-left: 10px;">{{ props.type }} </span>
            <i class="iconfont  right-2" style="font-size: 10px; color: rgb(32, 33, 33);float:right; margin-right: 5px;" v-if="props.type=='当前设备是否支持指纹识别'">
                <span>{{ NoSupported }} </span>
            </i>
            <i class="iconfont  right-2" style="font-size: 10px; color: rgb(32, 33, 33);float:right; margin-right: 5px;" v-if="props.type=='当前设备是否已经录入指纹信息'">
                <span>{{ Notentered }} </span>
            </i>
            <i class="iconfont  right-2" style="font-size: 10px; color: rgb(32, 33, 33);float:right; margin-right: 5px;" v-if="props.type=='开启/关闭指纹识别认证'">
                <el-switch v-model="value1" disabled="true" />
            </i>
        </p>
    </div>
</template>
<style scoped>
.go{
    width: 93%;
    height: 40px;
    line-height: 40px;
    padding: 5px 10px;
    background-color: #fff;
    border: 1px solid lavender ;
}
.right-1{
    vertical-align: middle;
}
.right-2{
    vertical-align: middle;
}
</style>